<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.or">
<head>
<meta  charset="utf-8" name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>NeptuneGymsSystem</title>
<style>
	.income{
		font-size:25px;
		color:green;
	}
	.outgoing{
		font-size:25px;
		color:red;
	}
</style>
<link rel="stylesheet" href="../layui/css/layui.css">
</head>
<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin" >
  <div class="layui-header">
    <div class="layui-logo"><h1>健身房</h1></div>
    <!-- 顶部导航 -->
    <ul class="layui-nav layui-bg-cyan layui-layout-left">
      <li class="layui-nav-item">
      	<a href="">会员管理</a>
      	<dl class="layui-nav-child">
          	<dd><a href="../visit/index">会员来访</a></dd>
          	<dd><a href="../member/index">会员管理</a></dd>
            <dd><a href="../card/index_entity">会员卡管理</a></dd>
            <dd><a href="../card/index">会员卡设置</a></dd>
        </dl>
      </li>
      <li class="layui-nav-item">
      	<a href="">商品管理</a>
      	<dl class="layui-nav-child">
            <dd><a href="../goods/index">商品管理</a></dd>
            <dd><a href="../goodsType/index">商品类型</a></dd>
            <dd><a href="../goodsSale/index">消费记录</a></dd>
            <dd><a href="../stock/index">库存管理</a></dd>
            <dd><a href="../operate/index">库存操作记录</a></dd>
          </dl>
      </li>
      <li class="layui-nav-item">
     	 <a href="">课程管理</a>
     	 <dl class="layui-nav-child">
            <dd><a href="/course/index">课程管理</a></dd>
            <dd><a href="/attendCourse/index">操课管理</a></dd>  
            <dd><a href="/searchOrder/index">约课管理</a></dd>          
          </dl>
      </li>
      <li class="layui-nav-item">
      	<a href="">统计报表</a>
      	<dl class="layui-nav-child">
            <dd><a href="http://localhost:8080/change_1">会员消费统计</a></dd>
            <dd><a href="http://localhost:8080/change_2">营业报表统计</a></dd>
            <dd><a href="http://localhost:8080/change_3">员工业绩管理</a></dd>
            <dd><a href="http://localhost:8080/change_7">会员来访统计</a></dd>          
        </dl>
      </li>
      <li class="layui-nav-item">
        <a href="javascript:;">更多操作</a>
        <dl class="layui-nav-child">
          <dd><a href="http://localhost:8080/setting/stuff">员工管理</a></dd>
          <dd><a href="http://localhost:8080/trainer_management">教练管理</a></dd>
          <dd><a href="http://localhost:8080/setting/database">数据库管理</a></dd>         
        </dl>
      </li>
    </ul>
    <ul class="layui-nav layui-layout-right">
      <li class="layui-nav-item">
        <a href="javascript:;">
          <img id="user_img" src="http://t.cn/RCzsdCq" class="layui-nav-img">
          <label id="user_name"></label>
        </a>
        <dl class="layui-nav-child">
          <dd><a id="userInformation" href="#">基本资料</a></dd>
        </dl>
      </li>
      <li class="layui-nav-item"><a href="http://localhost:8080/login_out">退出</a></li>
    </ul>
  </div>
  
  <div class="layui-side layui-bg-black">
    <div class="layui-side-scroll">
      <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
      <ul class="layui-nav layui-bg-cyan layui-nav-tree">
        <li class="layui-nav-item">
          <a class="" href="javascript:;">会员管理</a>
          <dl class="layui-nav-child">
          	<dd><a href="../visit/index">会员来访</a></dd>
          	<dd><a href="../member/index">会员管理</a></dd>
            <dd><a href="../card/index_entity">会员卡管理</a></dd>
            <dd><a href="../card/index">会员卡设置</a></dd>
          </dl>
        </li>
        <li class="layui-nav-item layui-nav-itemed">
          <a href="javascript:;">商品管理</a>
          <dl class="layui-nav-child">
            <dd><a href="../goods/index">商品管理</a></dd>
            <dd><a href="../goodsType/index">商品类型</a></dd>
            <dd><a href="../goodsSale/index">消费记录</a></dd>
            <dd><a href="../stock/index">库存管理</a></dd>
            <dd class="layui-this"><a href="../operate/index">库存操作记录</a></dd>
          </dl>
        </li>
        <li class="layui-nav-item">
          <a href="javascript:;">课程管理</a>
          <dl class="layui-nav-child">
            <dd><a href="/course/index">课程管理</a></dd>
            <dd><a href="/attendCourse/index">操课管理</a></dd>
            <dd><a href="/searchOrder/index">约课管理</a></dd>            
          </dl>
        </li>
         <li class="layui-nav-item">
          <a href="javascript:;">统计报表</a>
          <dl class="layui-nav-child">
            <dd><a href="http://localhost:8080/change_1">会员消费统计</a></dd>
            <dd><a href="http://localhost:8080/change_2">营业报表统计</a></dd>
            <dd><a href="http://localhost:8080/change_3">员工业绩管理</a></dd>
            <dd><a href="http://localhost:8080/change_7">会员来访统计</a></dd>   
          </dl>
        </li>
         <li class="layui-nav-item">
        <a href="javascript:;">更多操作</a>
        <dl class="layui-nav-child">
          <dd><a href="http://localhost:8080/setting/stuff">员工管理</a></dd>
          <dd><a href="http://localhost:8080/trainer_management">教练管理</a></dd>
          <dd><a href="http://localhost:8080/setting/database">数据库管理</a></dd>         
        </dl>
      </li>       
      </ul>
    </div>
  </div>
  
<div class="layui-body">
    <!-- 内容主体区域 -->
				
		<!-- 表格渲染 -->
		<table class="layui-hide" id="operate_dataTable" lay-filter="operate_dataTable" ></table>

		<!-- 分页 -->	
		<div id="operate_pageBox"></div>
		
		<!-- 统计区域 -->
		<div style="width:600px;height:30px;margin:auto;">
		<table>
			<tr>
				<td>
					<span style="font-size:25px;">入库：</span>
				</td>
				<td>
					<div class="layui-input-inline" style="width:180px;">				
						<div id="income" class="income" style="padding-top:4px;"></div>
					</div>
				</td>
				<td>
					<span style="font-size:25px;">出库：</span>
				</td>
				<td>
					<div class="layui-input-inline" style="width:180px;">				
						<div id="outgoing" class="outgoing" style="padding-top:4px;"></div>
					</div>
				</td>
			</tr>
		</table>			
		</div>
<script type="text/html" id="operate_toolBar">
	<input type="button" class="layui-btn layui-btn-sm" lay-event="delete" value="删除" id="delete"> 	
	<div class="layui-input-inline">
    	<input type="text" class="layui-input" id="tiaoJian" placeholder="员工或商品的ID或名称">
    </div>
	<div class="layui-input-inline">
    	<input type="text" class="layui-input" id="startTime" placeholder="起始时间">
    </div>
	<div class="layui-input-inline">
        <input type="text" class="layui-input" id="endTime" placeholder="截至时间">
    </div>  	
	<input type="button" class="layui-btn layui-btn-sm layui-btn-primary" value="查询" id="query" lay-event="query">
</script>
			
		      	
    
   </div>  
  	<div class="layui-footer" align="center">
  	<div style="padding: 15px;" align="center">
	    <span class="layui-badge-dot"></span>
		<span class="layui-badge-dot layui-bg-orange"></span>
		<span class="layui-badge-dot layui-bg-green"></span>
		<span class="layui-badge-dot layui-bg-cyan"></span>
		<span class="layui-badge-dot layui-bg-blue"></span>
		<span class="layui-badge-dot layui-bg-black"></span>
		<span class="layui-badge-dot layui-bg-gray"></span>
		<span>Copyright ©2019-2020 GYJ.All Rights Reserved.</span>
        <span class="layui-badge-dot layui-bg-gray"></span>
        <span class="layui-badge-dot layui-bg-black"></span>
        <span class="layui-badge-dot layui-bg-blue"></span>
        <span class="layui-badge-dot layui-bg-cyan"></span>
        <span class="layui-badge-dot layui-bg-green"></span>
        <span class="layui-badge-dot layui-bg-orange"></span>
        <span class="layui-badge-dot"></span>
    </div>
    	<hr class="layui-bg-cyan"> 
  	</div>
	</div>		
	
 
	
	
	
	<script src="../layui/layui.js"></script>
	<script src="../js/user.js"></script>
	<script type="text/javascript">
	layui.use(['layer','jquery','form','laypage','table','element','laydate'],function(){
		var layer=layui.layer;
		var $=layui.jquery;
		var form=layui.form;
		var laypage=layui.laypage;
		var table=layui.table;						
		var element=layui.element;	
		var laydate=layui.laydate;
		
		$.ajax({					//为头像和用户名赋值
			url:'/user/get_user',
			//dataType:'json',
			type:'get',			
			success:function(data){
				document.getElementById("user_img").src=data.image;
				document.getElementById("user_name").innerHTML=data.name;
			}
		});
		
		//日期时间选择器
	    laydate.render({
			elem: '#startTime'
		   ,type: 'datetime'
		});		
		//日期时间选择器
		laydate.render({
		  elem: '#endTime'
		  ,type: 'datetime'
		});
		//真分页
		$(function(){
			var startTime=null;
			var endTime=null;
			var tiaoJian=null;
			var url='/operate/getOperateBtween';
			getData(0,startTime,endTime,tiaoJian,url);
		})
		function getData(pageStart,startTime,endTime,tiaoJian,url){
			layui.use(['table','laypage'],function(){
				var table=layui.table;
				var laypage=layui.laypage;
				table.render({
					elem:'#operate_dataTable'
					,url:url
					,method:"get"
					,where:{
						startTime:startTime
						,endTime:endTime
						,gOS:tiaoJian
						,pageStart:pageStart
						,pageSize:10
					}
					,parseData:function(res){				
						console.log(res)
						return{
							"code":0
							,"msg":""
							,"count":res.rowSize
							,"data":res.data
							,"curr":res.pageStart
							,"limit":res.limit
						}
					}
					,toolbar: '#operate_toolBar'//开启头部工具栏，并为其绑定左侧模板
					,defaultToolbar: ['filter', 'exports', 'print', { //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
						title: '提示'
					    ,layEvent: 'LAYTABLE_TIPS'
					    ,icon: 'layui-icon-tips'
					 }]
					//,cellMinWidth:100
					,cols:[
				    		[
						      {type: 'checkbox', fixed: 'left'}
						      ,{field:'operateStockId', title:'操作编号', width:240, fixed: 'left', unresize: true, sort: true}
						      ,{field:'stuffName', title:'员工姓名', width:140}	      
						      ,{field:'goodsName', title:'商品名称', width:150 }
						      ,{field:'operateStockState', title:'操作状态', width:120}
						      ,{field:'operateStockNumber', title:'数量' ,width:120}
						      ,{field:'operateStockPrice', title:'价格', width:130, sort: true}
						      ,{field:'operateStockTime', title:'时间', width:240, sort: true}						      
				   			]
				    	]
					,done:function(res,curr,count){
						console.log(res);
						laypage.render({
							elem:'operate_pageBox'
							,count:res.count
							,limit:res.limit
							,layout: ['count','prev','page','next','skip']
							,curr:res.curr/10+1
							,jump:function(obj,first){//触发分页后的回调
								if(!first){//点击跳转触发函数自身，并传递当前页：obj.curr							
									res.pageStart=obj.limit*(obj.curr-1);
									console.log(res.pageStart);
									getData(res.pageStart,startTime,endTime,tiaoJian,url);														
								}//if
							}//jump function
						});
						laydate.render({
							elem: '#startTime'
						   ,type: 'datetime'
						});		
						//日期时间选择器
						laydate.render({
						  elem: '#endTime'
						  ,type: 'datetime'
						});
						$(document).ready(function(){
							var income=0;
							var outgoing=0;
							var a="活动出库";
							var b="过期出库";	
							var c="销售出库";
							var d="进货入库";
							var e="其他入库";
							
							$("table tr td").find("div").each(function(){//遍历页面table中的div								
								if($(this).html()==a){ 
									$(this).css("color","red");
									var aa=$(this).parent().next().next().children('div.layui-table-cell');									
									aa.css("color","red");
									outgoing+=parseInt(aa.text());
								}
								if($(this).html()==b){ 
									$(this).css("color","red");
									var bb=$(this).parent().next().next().children('div.layui-table-cell');	
									bb.css("color","red");
									outgoing+=parseInt(bb.text());
								}
								if($(this).html()==c){ 
									$(this).css("color","red");
									var cc=$(this).parent().next().next().children('div.layui-table-cell');	
									cc.css("color","red");
									outgoing+=parseInt(cc.text());
								}
								if($(this).html()==e){ 
									$(this).css("color","green");
									var ee=$(this).parent().next().next().children('div.layui-table-cell');	
									ee.css("color","green");
									income+=parseInt(ee.text());
								}
								if($(this).html()==d){
									$(this).css("color","green");
									var dd=$(this).parent().next().next().children('div.layui-table-cell');	
									dd.css("color","green");
									income+=parseInt(dd.text());
								}	
							});
							console.log(income);
							console.log(outgoing);
							$('#income').html(income);
							$('#outgoing').html(outgoing);
						});
					}
				});
			});
		}//function
		//表格顶部工具栏
		table.on('toolbar(operate_dataTable)',function(res){
			 var checkStatus=table.checkStatus(res.config.id);
			 var data=checkStatus.data;
			 var event=res.event;
			 var i=0;
			 var tiaoJian=$('#tiaoJian').val();
			 var startTime=$('#startTime').val();
			 var endTime=$('#endTime').val();
			 switch(res.event){			 	
			 	case 'delete':
			 		if(data.length===0){
			 			layer.msg('请选择一行');
			 		}
			 		else if(data.length>1){
			 			layer.confirm('真的删除行么', function(index){
				 			for(i=0;i<data.length;i++){
				 				deleteOperateById(checkStatus.data[i].operateStockId);
				 			}	
				 			layer.close(index);
			 			});			 			
			 		}
			 		else{
			 			layer.confirm('真的删除行么', function(index){
			 				deleteOperateById(checkStatus.data[0].operateStockId);
			 		        layer.close(index);
			 		        //向服务端发送删除指令
			 		      });
			 		}
			 		break; 
			 	case 'query':
			 		if(tiaoJian===""&&startTime===""&&endTime===""){//三个条件为空，执行全查
			 			var url='/operate/getOperateBtween';
			 			getData(0,null,null,null,url);
			 		}
			 		else if(tiaoJian!=""&&startTime!=""&&endTime!=""){//三个条件均有
			 			var url='/operate/queryBy3';
			 			getData(0,startTime,endTime,tiaoJian,url);
			 		}
			 		else if(tiaoJian!=""&&startTime===""&&endTime===""){//只有条件 没有时间
			 			var url='/operate/queryBy1';
			 			getData(0,null,null,tiaoJian,url);
			 		}
			 		else if(tiaoJian===""&&startTime!=""&&endTime!=""){//只有时间 没有条件
			 			var url='/operate/queryBy2';
			 			getData(0,startTime,endTime,null,url);
			 		}
			 		else if(tiaoJian!=""&&startTime===""&&endTime!=""){//有条件和结束时间
			 			layer.msg("请输入起始时间");
			 		}
			 		else if(tiaoJian===""&&startTime===""&&endTime!=""){//只有结束时间
			 			layer.msg("请输入起始时间");
			 		}
			 		else if(tiaoJian===""&&startTime!=""&&endTime===""){//只有起始时间
			 			layer.msg("请输入结束时间");
			 		}
			 		else{
			 			layer.msg("请输入结束时间");
			 		}
			 		break;
			 }
		 });
		
		function deleteOperateById(operateStockId){
			var startTime=null;
			var endTime=null;
			var tiaoJian=null;
			var url='/operate/getOperateBtween'
			$.ajax({
				type:'post'
				,url:'../operate/deleteOperateById?operateStockId='+operateStockId
				,success:function(){					
					getData(0,startTime,endTime,tiaoJian,url);
				}
				,error:function(){
					alert("异常");
				}
			});
		}
		
	});							
	</script>
</body>
</html>